<!DOCTYPE html>
<html>
<head>
	<title>数据图表</title>
	<#include "../../include/head-file.ftl">
	<#--<script type="text/babel" src="${base}/static/global.config.js"></script>-->
	<script type="text/babel" src="${base}/static/ol/Map.js"></script>
	<script type="text/babel" src="${base}/static/ol/View.js"></script>
	<script type="text/babel" src="${base}/static/ol/Feature.js"></script>
	<script type="text/babel" src="${base}/static/ol/layer/Group.js"></script>
	<script type="text/babel" src="${base}/static/ol/source/TileWMS.js"></script>
	<script type="text/babel" src="${base}/static/ol/layer/Tile.js"></script>

</head>
<body>
<div id="rlt-main-map"></div>
</body>
</html>
<script>
    <#--import { mapConfig } from "${base}/static/global.config.js";-->
    "use strict";
    var indexVue = new Vue({
        el: '#index',
        data: {
            map: null,
            view: null,
        },
        created: function () {

        },
        mounted:function () {
            var that=this
            setTimeout(function () {
                console.log("mapConfig")
                // console.log(mapConfig)
                that.initMap()
            },2000)
            // console.log("mapConfig2")
            // console.log(mapConfig)
        },
        methods: {
            initMap(){
                this.view = new View({
                    projection: "EPSG:4326",
                    center: [110.320042, 20.035132],
                    zoom: 12,
                    minZoom: 6
                });
                this.map = new Map({
                    target: "map",
                    view: this.view
                });
                // this.map.addLayer(
                //     new LayerGroup({
                //         layers: this.layerData()
                //     })
                // );
			},
            //添加图层（金拓维电子地图）
            layerData() {
                let data = [];
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.PROPL_ZW) //（省级行政区划）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.VEGPL_ZW) //（植被面）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.HYDPL_ZW) //（水系面）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.RESPL_ZW) //（居民地面）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.RAILN_ZW) //（铁路线）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.ROALN_ZW) //（道路线）
                    })
                );
                data.push(
                    new TileLayer({
                        source: new TileWMS(this.$globalConfig.mapConfig.PLAPT_ZW) //（地名地址）
                    })
                );
                return data;
            },
        },
    });
</script>
<style>
	#rlt-main-map{
		width: 100%;
		height:100vh;
		/*top: 5%*/
	}
	.BMap_cpyCtrl {
		display: none;
	}
	.anchorBL {
		display: none;
	}
</style>